﻿console = console;
console.log = console.log;

var WREF = {};

WREF.ElementTypesCollection = {
    Circle: "circle"
    , Ellipse: "ellipse"
    , Image: "image"
    , Line: "path"
//    , Print: "print"
    , Rectangle: "rect"
    , Text: "text"
};

WREF.LayoutItem = function LayoutItem(type, attributes, id, events, data, zIndex) {
    try {
        this.Attributes = (attributes)
                                ? attributes
                                : {};
        this.Data = (data)
                        ? data
                        : {};
        this.ID = (id)
                    ? id
                    : ++WREF.ElementsLastID;
        this.Events = (events)
                        ? events
                        : [];
        this.Type = (type)
                        ? type
                        : "";
        this.ZIndex = (zIndex)
                        ? zIndex
                        : 0;
    }
    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
};

WREF.ActionsPanelContainer = null;
WREF.Canvas = {
    Background: null
    , DrawingElement: null
    , Paper: null
    , LastHeight: 0
    , LastWidth: 0
//    , X: 0
//    , Y: 0
};
WREF.DrawingElement = {
    KeyShortcutsID: {
        Escape: null
    }
};
WREF.ElementsDrawedCollection = {};
WREF.ElementsLastID = -1;
WREF.ElementsCollection = {};
WREF.PaperContainer = null;

WREF.DrawItem = function DrawItem(graph, layoutItem) {
    var element = null;
    try {
        if((graph) && (layoutItem))
        {
            element = graph[layoutItem.Type]();

            WREF.FixElementAttributes(layoutItem.Type, layoutItem.Attributes);

            element.attr(layoutItem.Attributes);
            element.data("Data", layoutItem.Data);

            if(layoutItem.Events)
            {
                for(var eventIndex = 0; eventIndex < layoutItem.Events.length; eventIndex++)
                {
                    var event = layoutItem.Events[eventIndex];

                    for(var handlerIndex = 0; handlerIndex < event.HandlersList.length; handlerIndex++)
                        element[event.Name](event.HandlersList[handlerIndex]);
                }
            }

            WREF.ElementsCollection[layoutItem.ID] = element;
        }
    }
    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
    return element;
};
WREF.DrawItems = function DrawItems(graph, layoutItemsList) {
    var elementsList = [];
    try {
        if((graph) && (layoutItemsList))
//            layoutItemsList.sort(WREF.SortLayoutItemsListByZIndex);
            for(var layoutItemIndex = 0; layoutItemIndex < layoutItemsList.length; layoutItemIndex++)
                elementsList.push(WREF.DrawItem(layoutItemsList[layoutItemIndex]));
    }
    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
    return elementsList;
};
WREF.FinishCurrentDraw = function FinishCurrentDraw(removeElement) {
    try {
        if(WREF.Canvas.DrawingElement)
        {
            if(removeElement == true)
            {
                WREF.Canvas.DrawingElement.remove();
            }
            else
            {
                WREF.Canvas.DrawingElement.unmousemove(WREF.Background_MouseMove)
                                            .unmouseup(WREF.Background_MouseUp);

                WREF.ElementsDrawedCollection[WREF.Canvas.DrawingElement.id] = WREF.Canvas.DrawingElement;
            }

            WREF.Canvas.Background.unmousemove(WREF.Background_MouseMove)
                                    .unmouseup(WREF.Background_MouseUp);

            for(var elementID in WREF.ElementsDrawedCollection)
            {
                WREF.ElementsDrawedCollection[elementID].unmousemove(WREF.Background_MouseMove)
                                                        .unmouseup(WREF.Background_MouseUp);
            }

            KeyShortcut.Remove(WREF.DrawingElement.KeyShortcutsID.Escape);

            WREF.Canvas.DrawingElement = null;
        }
    }
    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
};
WREF.FixElementAttributes = function FixElementAttributes(elementType, attributes) {
    try {
        switch(elementType)
        {
            case WREF.ElementTypesCollection.Circle:
                attributes.cx = attributes.x + (attributes.width / 2);
                attributes.cy = attributes.y + (attributes.height / 2);
                attributes.r = (Math.min(attributes.width, attributes.height) / 2);

                attributes.x = undefined;
                attributes.y = undefined;

                break;
            case WREF.ElementTypesCollection.Ellipse:
                attributes.cx = attributes.x + (attributes.width / 2);
                attributes.cy = attributes.y + (attributes.height / 2);
                attributes.rx = attributes.width / 2;
                attributes.ry = attributes.height / 2;

                attributes.x = undefined;
                attributes.y = undefined;
                break;
            case WREF.ElementTypesCollection.Line:
                        
                break;
            default:
                break;
        }
    }
    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
};
//WREF.UpdatePaperSize = function UpdatePaperSize() {
//    try {
//        WREF.Canvas.Paper.setSize($(window).width(true), $(window).height(true));

//        WREF.Canvas.Paper.setViewBox(0, 0, $(window).width(true), $(window).height(true));    

//        WREF.Canvas.Paper.setViewBox(
//            0
//            , 0
//            , WREF.Canvas.LastWidth + ($(window).width(true) - WREF.Canvas.LastWidth)
//            , WREF.Canvas.LastHeight + ($(window).height(true) - WREF.Canvas.LastHeight)
//        );

//        WREF.Canvas.LastHeight = $(window).height(true);
//        WREF.Canvas.LastWidth = $(window).width(true);
//    }
//    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
//};
WREF.UpdateBodyHeight = function UpdateBodyHeight() {
    try {
        $(document.body).css({ height: $(window).height(true) + "px" });
    }
    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
};

WREF.Background_MouseDown = function Background_MouseDown(e) {
    try
    {
        WREF.Canvas.Background.mousemove(WREF.Background_MouseMove)
                                .mouseup(WREF.Background_MouseUp);
    }
    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
};
WREF.Background_MouseMove = function Background_MouseMove(e) {
    try
    {
        if(!WREF.Canvas.DrawingElement)
        {
            WREF.Canvas.DrawingElement = WREF.DrawItem(
                WREF.Canvas.Paper
                , new WREF.LayoutItem(
                    WREF.ElementTypesCollection.Ellipse
                    , { fill: "#FF0000", x: 1, y: 1, height: 1, width: 1 }
                    , null
                    , null
                    , {
                        StartX: e.layerX
                        , StartY: e.layerY
                    }
                )
            );

            WREF.Canvas.DrawingElement.mousemove(WREF.Background_MouseMove)
                                        .mouseup(WREF.Background_MouseUp);

            for(var elementID in WREF.ElementsDrawedCollection)
            {
                WREF.ElementsDrawedCollection[elementID].mousemove(WREF.Background_MouseMove)
                                                        .mouseup(WREF.Background_MouseUp);
            }

            WREF.DrawingElement.KeyShortcutsID.Escape = KeyShortcut.Add("Escape", WREF.Window_KeyDown_Escape);
        }

        var x = e.layerX;
        var y = e.layerY;
        var newAttr = WREF.Canvas.DrawingElement.attr();
        var data = WREF.Canvas.DrawingElement.data("Data");

        if(x > data.StartX)
        {
            newAttr.x = data.StartX;
            newAttr.width = x - data.StartX;
        }
        else if(x <= data.StartX)
        {
            newAttr.x = x;
            newAttr.width = data.StartX - x;
        }
        if(y > data.StartY)
        {
            newAttr.y = data.StartY;
            newAttr.height = y - data.StartY;
        }
        else if(y <= data.StartY)
        {
            newAttr.y = y;
            newAttr.height = data.StartY - y;
        }

        WREF.FixElementAttributes(WREF.Canvas.DrawingElement.type, newAttr);

        WREF.Canvas.DrawingElement.attr(newAttr);
    }
    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
};
WREF.Background_MouseUp = function Background_MouseUp(e) {
    try
    {
        WREF.FinishCurrentDraw();
    }
    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
};
WREF.Window_KeyDown_Escape = function Window_KeyDown_Escape(e) {
    try
    {
        WREF.FinishCurrentDraw(true);
    }
    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
};
WREF.Window_Resize = function Window_Resize(e) {
    try {
//        WREF.UpdatePaperSize();
        WREF.UpdateBodyHeight();
    }
    catch(Error) { console.error(Error.message); Common.ShowError(Error); }
};

$(document).ready(function () {
    try {
        WREF.PaperContainer = $("<div>")
                                .css({ position: "relative", float:"left", height: "100%", width: "80%" })
                                .appendTo(document.body);

        WREF.Canvas.Paper = Raphael(WREF.PaperContainer[0], "100%", "100%");
//        WREF.Canvas.Paper = Raphael(0, 0, $(window).width(true), $(window).height(true));
        WREF.Canvas.Paper.setViewBox(0, 0, WREF.PaperContainer.outerWidth(true), WREF.PaperContainer.outerHeight(true));
        WREF.Canvas.Paper.canvas.setAttribute("preserveAspectRatio", "none");

        WREF.ActionsPanelContainer = $("<div>")
                                    .css({ position: "relative", float:"left", height: "100%", width: "20%", backgroundColor: "#D4D4D4" })
                                    .appendTo(document.body);

        WREF.UpdateBodyHeight();
        $(window).bind("resize", WREF.Window_Resize);

        WREF.Canvas.Background = WREF.DrawItem(
            WREF.Canvas.Paper
            , new WREF.LayoutItem(
                WREF.ElementTypesCollection.Rectangle
                , { fill: "#DCDCDC", "stroke-width": 0, x: 0, y: 0, height: WREF.Canvas.Paper.height, width: WREF.Canvas.Paper.width }
            )
        );
        WREF.Canvas.Background.mousedown(WREF.Background_MouseDown);

//        WREF.Canvas.Background = WREF.DrawItem(
//            WREF.Canvas.Paper
//            , new WREF.LayoutItem(
//                WREF.ElementTypesCollection.Rectangle
//                , { fill: "#00FF00", x: $(window).width(true) / 2 / 2, y: $(window).height(true) / 2 / 2, height: $(window).height(true) / 2, width: $(window).width(true) / 2 }
//            )
//        );

//        var factor = 0
//            , x = 10
//            , y = 10
//            , width = 10
//            , height = 10
//            , itemsList = [
//                new WREF.LayoutItem(WREF.ElementTypesCollection.Rectangle, {  fill: "#0000FF", x: x * ++factor, y: y * (factor + 1), height: height * (factor + 1), width: width * (factor + 1) })
//                , new WREF.LayoutItem(WREF.ElementTypesCollection.Rectangle, {  fill: "#00FF00", x: x * ++factor, y: y * (factor + 1), height: height * (factor + 1), width: width * (factor + 1) })
//                , new WREF.LayoutItem(WREF.ElementTypesCollection.Rectangle, {  fill: "#FF0000", x: x * ++factor, y: y * (factor + 1), height: height * (factor + 1), width: width * (factor + 1) })
//                , new WREF.LayoutItem(WREF.ElementTypesCollection.Rectangle, {  fill: "#000000", x: x * ++factor, y: y * (factor + 1), height: height * (factor + 1), width: width * (factor + 1) })
//            ];

//        WREF.DrawItems(WREF.Canvas.Paper, itemsList);

//        var animation = Raphael.animation({ transform: "r" + 360 }, 2000, function() { WREF.ElementsCollection[WREF.ElementsLastID].animate(animation2); }).delay(500);
//        var animation2 = Raphael.animation({ transform: "r" + 0 }, 2000);

//        WREF.ElementsCollection[WREF.ElementsLastID].animate(animation);
    }
    catch (Error) { Common.ShowError(Error); }
});